<template>
  <div class="flex justify-end pt-5">
    <el-pagination
      background
      :layout="layout"
      :current-page="page"
      :page-size="limit"
      @current-change="changePage"
      @size-change="changeLimit"
      :total="total"
      :page-sizes="[100, 500, 1000]"
      :default-page-size="limit"
    />
  </div>
</template>

<script lang="ts" setup>
import { inject, ref } from 'vue'

const layout = 'total,sizes,prev, pager,next'

// const pageSizes = [100,500,1000]
// const defaultPageSize = ref(100)

interface paginate {
  page: number
  limit: number
  total: number
  changePage: number
  changeLimit: number
}
const loading = ref(false)

const { page, limit, total, changePage, changeLimit } = inject('paginate') as paginate
</script>

<style scoped></style>
